<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src = "jquery-3.7.1.js"></script>
</head>
<body>
    <h1> 猜数字 </h1>
    <!-- 实现一个猜数字 -->
    
    <span>输入要猜的数字</span><br>
    <input type = 'text' id = "te"></input>
    <button type = "button" id = "bt" >
        提交
    </button><br>
    <span>结果 ：</span> <span id = "result"></span><br>
    <span>  <button type = "button" id = "reset" >
        重开一局
    </button><br></span>
    <script>

        //生成一个1-100 的随机数
        let num = Math.floor(Math.random()*100)+1;
        console.log("num = "+ num);
        $("#bt").click(function(){
            let number = $("#te").val();
            if(number==null){
                return;
            }
            if(number > num){
                $("#result").text('猜大了');
                $("#result").css("color","red");
            }else if(number < num ){
                $("#result").text('猜小了');
                $("#result").css("color","red");
            }else{
                $("#result").text('猜对了');
                $("#result").css("color","green");
            }
        })        
        
        $("#reset").click(function(){
            $("#result").text("");
            $("#te").val("");
        })
// okk
    </script>
</body>
</html>





